// Dark color mode variables
//
// Custom variables for the `[data-bs-theme="dark"]` theme.

// Global colors

/* stylelint-disable */
$primary-text-emphasis-dark: adjust-color($primary, $lightness: -5%) !default;
$secondary-text-emphasis-dark: $gray-200 !default;
$success-text-emphasis-dark: adjust-color($success, $lightness: -5%) !default;
$danger-text-emphasis-dark: adjust-color($danger, $lightness: -5%) !default;
$warning-text-emphasis-dark: adjust-color($warning, $lightness: -5%) !default;
$info-text-emphasis-dark: adjust-color($info, $lightness: -5%) !default;
$light-text-emphasis-dark: $gray-200 !default;
$dark-text-emphasis-dark: $white !default;
/* stylelint-enable */

$primary-bg-subtle-dark: mix($gray-900, $primary, 90%) !default;
$secondary-bg-subtle-dark: $gray-800 !default;
$success-bg-subtle-dark: mix($gray-900, $success, 90%) !default;
$danger-bg-subtle-dark: mix($gray-900, $danger, 90%) !default;
$warning-bg-subtle-dark: mix($gray-900, $warning, 90%) !default;
$info-bg-subtle-dark: mix($gray-900, $info, 90%) !default;
$light-bg-subtle-dark: $gray-900 !default;
$dark-bg-subtle-dark: $gray-950 !default;

$primary-border-subtle-dark: mix($gray-900, $primary, 80%) !default;
$secondary-border-subtle-dark: $gray-700 !default;
$success-border-subtle-dark: mix($gray-900, $success, 80%) !default;
$danger-border-subtle-dark: mix($gray-900, $danger, 80%) !default;
$warning-border-subtle-dark: mix($gray-900, $warning, 80%) !default;
$info-border-subtle-dark: mix($gray-900, $info, 80%) !default;
$light-border-subtle-dark: $gray-700 !default;
$dark-border-subtle-dark: $gray-950 !default;

$body-color-dark: $gray-300 !default;
$body-bg-dark: $gray-900 !default;
$body-secondary-color-dark: $gray-400 !default;
$body-secondary-bg-dark: $gray-700 !default;
$body-tertiary-color-dark: $gray-500 !default;
$body-tertiary-bg-dark: $gray-800 !default;
$body-emphasis-color-dark: $gray-100 !default;
$user-selection-color-dark: rgba($white, 0.12) !default;
$border-color-dark: $gray-700 !default;
$headings-color-dark: $white !default;

$component-color-dark: $gray-200 !default;
$component-hover-color-dark: $white !default;
$component-hover-bg-dark: $gray-800 !default;
$component-active-color-dark: $white !default;
$component-active-bg-dark: $gray-700 !default;
$component-disabled-color-dark: $gray-500 !default;

// Shadows

$box-shadow-dark: 0 0.5rem 1.875rem -0.25rem rgba(#080b12, 0.25) !default;
$box-shadow-sm-dark: 0 0.375rem 1.375rem -0.25rem rgba(#080b12, 0.25) !default;
$box-shadow-lg-dark: 0 0.75rem 3rem -0.5rem rgba(#080b12, 0.25) !default;

// Focus styles

$focus-ring-opacity-dark: 0.12 !default;
$focus-ring-color-dark: rgba($white, $focus-ring-opacity) !default;

// Tables

$table-striped-bg-factor-dark: 0.05 !default;
$table-striped-bg-dark: rgba($white, $table-striped-bg-factor-dark) !default;

$table-active-bg-factor-dark: 0.1 !default;
$table-active-bg-dark: rgba($white, $table-active-bg-factor-dark) !default;

$table-hover-bg-factor-dark: 0.075 !default;
$table-hover-bg-dark: rgba($white, $table-hover-bg-factor-dark) !default;

// Buttons

$btn-color-dark: $gray-200 !default;
$btn-hover-color-dark: $white !default;
$btn-link-disabled-color-dark: $gray-400 !default;

// Forms

$input-bg-dark: transparent !default;
$input-border-color-dark: $gray-600 !default;
$input-focus-bg-dark: transparent !default;
$input-focus-border-color-dark: $white !default;

$form-check-input-bg-dark: $input-bg-dark !default;
$form-check-input-border-dark: var(--#{$prefix}border-width) solid
  $input-border-color-dark !default;
$form-check-input-checked-color-dark: $white !default;
$form-check-input-checked-bg-color-dark: $form-check-input-bg-dark !default;
$form-check-input-checked-border-color-dark: $white !default;
$form-check-input-checked-bg-image-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-checked-color-dark}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/></svg>") !default;
$form-check-radio-checked-bg-image-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='#{$form-check-input-checked-color-dark}'/></svg>") !default;

$form-check-input-indeterminate-color-dark: $form-check-input-checked-color-dark !default;
$form-check-input-indeterminate-bg-color-dark: $form-check-input-checked-bg-color-dark !default;
$form-check-input-indeterminate-border-color-dark: $form-check-input-checked-border-color-dark !default;
$form-check-input-indeterminate-bg-image-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-indeterminate-color-dark}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/></svg>") !default;

$form-switch-bg-color-dark: $gray-600 !default;

$form-valid-color-dark: $success !default;
$form-valid-border-color-dark: $success !default;
$form-invalid-color-dark: $danger !default;
$form-invalid-border-color-dark: $danger !default;

// Input group

$input-group-addon-border-color-dark: $input-border-color-dark !default;

// Navs

$navbar-nav-link-action-bg-dark: rgba($white, 0.08);

$nav-tabs-link-hover-bg-dark: rgba($gray-700, 0.4) !default;
$nav-tabs-link-active-bg-dark: $gray-700 !default;
$nav-tabs-link-active-box-shadow-dark: none !default;

// Accordion

$accordion-icon-color-dark: $white !default;
$accordion-icon-active-color-dark: $white !default;
$accordion-button-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='#{$accordion-icon-color-dark}'><path d='M3.8,7.9c0.4-0.4,1.1-0.4,1.5,0l6.7,6.7l6.7-6.7c0.4-0.4,1.1-0.4,1.5,0c0.4,0.4,0.4,1.1,0,1.5l-7.4,7.4c-0.4,0.4-1.1,0.4-1.5,0L3.8,9.4C3.3,9.1,3.3,8.4,3.8,7.9z'/></svg>") !default;
$accordion-button-active-icon-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='#{$accordion-icon-active-color-dark}'><path d='M3.8,7.9c0.4-0.4,1.1-0.4,1.5,0l6.7,6.7l6.7-6.7c0.4-0.4,1.1-0.4,1.5,0c0.4,0.4,0.4,1.1,0,1.5l-7.4,7.4c-0.4,0.4-1.1,0.4-1.5,0L3.8,9.4C3.3,9.1,3.3,8.4,3.8,7.9z'/></svg>") !default;
$accordion-button-icon-alt-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='#{$accordion-icon-color-dark}'><path d='M12 4.125c.483 0 .875.392.875.875v14c0 .483-.392.875-.875.875s-.875-.392-.875-.875V5c0-.483.392-.875.875-.875z'/><path d='M4.125 12c0-.483.392-.875.875-.875h14c.483 0 .875.392.875.875s-.392.875-.875.875H5c-.483 0-.875-.392-.875-.875z'/></svg>") !default;
$accordion-button-active-icon-alt-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='#{$accordion-icon-active-color-dark}'><path d='M4.125 12c0-.483.392-.875.875-.875h14c.483 0 .875.392.875.875s-.392.875-.875.875H5c-.483 0-.875-.392-.875-.875z'/></svg>") !default;

// Popovers

$popover-border-color-dark: $gray-700 !default;
$popover-box-shadow-dark: $box-shadow-dark !default;

// Breadcrumbs

$breadcrumb-divider-color-dark: $component-color-dark !default;
$breadcrumb-divider-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='#{$breadcrumb-divider-color-dark}'><path d='M8.381 5.381c.342-.342.896-.342 1.237 0l6 6c.342.342.342.896 0 1.237l-6 6c-.342.342-.896.342-1.237 0s-.342-.896 0-1.237L13.763 12 8.381 6.619c-.342-.342-.342-.896 0-1.237z'/></svg>") !default;
$breadcrumb-divider-flipped-dark: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='#{$breadcrumb-divider-color-dark}'><path d='M15.3,5.4c0.3,0.3,0.3,0.9,0,1.2L9.9,12l5.4,5.4c0.3,0.3,0.3,0.9,0,1.2s-0.9,0.3-1.2,0l-6-6c-0.3-0.3-0.3-0.9,0-1.2l6-6C14.4,5,14.9,5,15.3,5.4L15.3,5.4z'/></svg>") !default;

// Custom scrollbar

$scrollbar-bg-dark: $gray-600 !default;
$scrollbar-track-bg-dark: adjust-color(
  $gray-700,
  $lightness: -6%
) !default; // stylelint-disable-line

// Carousel

$carousel-bullet-bg-dark: rgba($white, 0.3) !default;
$carousel-bullet-active-bg-dark: var(--#{$prefix}primary) !default;

$carousel-progressbar-bg-dark: rgba($white, 0.3) !default;
$carousel-progressbar-fill-bg-dark: $white !default;

$carousel-scrollbar-bg-dark: rgba($white, 0.3) !default;
$carousel-scrollbar-drag-bg-dark: $white !default;
